<template>
  <common-page title="索引详情">
    <el-button slot="header" @click="back">返回</el-button>
    <common-list slot="content">
      <common-table slot="content" v-loading="loading" :data="list">
        <el-table-column label="索引名称" align="left" prop="indexName">
          <template slot-scope="{ row }">{{ row.indexName }}</template>
        </el-table-column>

        <el-table-column label="日志条数" align="left" prop="indexCount">
          <template slot-scope="{ row }">{{ row.indexCount }}</template>
        </el-table-column>

        <el-table-column label="存储空间" align="left" prop="spaceSize">
          <template slot-scope="{ row }">{{ row.spaceSize }}</template>
        </el-table-column>

        <el-table-column label="操作" align="left" width="48">
          <template slot-scope="{ row }">
            <el-button
              type="text"
              @click="del(row)"
              >删除</el-button
            >
            <!--v-hasPermi="['system:index:detailremove']" -->
            <!-- <el-button type="text" @click="close(row)" hasPermi
              >关闭</el-button
            > -->
          </template>
        </el-table-column>
      </common-table>

      <pagination
        slot="pagination"
        v-show="total > 0"
        :total="total"
        :page.sync="query.pageNum"
        :limit.sync="query.pageSize"
        @pagination="getList"
      />
    </common-list>
  </common-page>
</template>

<script>
import {
  repertory_detail_list,
  repertory_detail_remove,
  repertory_detail_close,
} from "@/api/management/echart/repertory";

export default {
  name: "",
  components: {},
  props: {},
  data() {
    return {
      isStatistics: 0,
      total: 1, // 总条数
      loading: false, // table 加载中
      list: [], // 数据列
      selectionIds: "", // 列表选中数据id
      single: true, // 非单个禁用
      multiple: true, // 非多个禁用
      query: {
        pageNum: 1,
        pageSize: 10,
      },
    };
  },
  // 方法
  methods: {
    /**
     * 返回
     */
    back() {
      this.$emit("back");
    },
    /**
     * 获取列表
     */
    getList() {
      this.loading = true;
      let query = { ...this.query };
      console.log(query);
      repertory_detail_list(query)
        .then((res) => {
          this.list = res.rows;
          this.total = res.total;
        })
        .finally(() => {
          this.loading = false;
        });
    },
    /**
     * 删除
     */
    del(row) {
      this.$GlobalDeleteConfirm().then(() => {
        repertory_detail_remove({
          indexName: row.indexName,
          datasourceId: this.query.datasourceId,
        }).then((res) => {
          this.getList();
          this.$GlobalSuccessMessage("删除成功");
        });
      }).catch(()=>{});
    },
    /**
     * 关闭
     */
    close(row) {
      this.$GlobalDeleteConfirm("是否确认关闭数据项?", "警告", {
        confirmButtonText: "确定",
        cancelButtonText: "取消",
        type: "warning",
      })
        .then(() => {
          repertory_detail_close({
            indexName: row.indexName,
          }).then((res) => {
            this.getList();
            this.$GlobalSuccessMessage("关闭成功");
          });
        }).catch(()=>{});
    },
    show(row, id) {
      this.query = {
        datasourceId: id,
        indexValue: row.indexValue,
        indexPrefix: row.indexPrefix,
        pageNum: 1,
        pageSize: 10,
      };
      this.getList();
    },
  },
  // 生命周期 - 创建完成（可以访问当前this实例）
  created() {},
  // 生命周期 - 挂载完成（可以访问DOM元素）
  mounted() {},
};
</script>
<style lang="scss" scoped>
.container {
  .table-box {
    margin-top: 40px;
  }
}
</style>
